


<!DOCTYPE html>  
<html lang="en">  
<head>  
<meta charset="UTF-8">  
<meta http-equiv="X-UA-Compatible" content="IE=edge">  
<title>发布图片</title>  
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">  
<meta name="apple-mobile-web-app-capable" content="yes">  
<meta name="apple-mobile-web-app-status-bar-style" content="black">  
<meta name="format-detection" content="telephone=no">  
<link rel="stylesheet" type="text/css" href="/Public/Weixin/css/common.css">  
</head>  
<body>  
<p>最多可添加9张</p>  
<input type="file" id="uploadphoto" name="uploadfile" value="点击上传图片"   style="display:none;" />    
<div class="imglist"></div>  
<input type="text" id="img_str" name="img_str">   
<a id="upload_button" href="javascript:void(0);" class="uploadImage uploadbtn">点击</a>   <br><br><br><br><br>
<div class="sb">发布</div>  
<script type="text/javascript" src="https://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>  
<script src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>  
<script>    
wx.config({  
debug: false,  
appId: '{$signPackage["appId"]}',  
timestamp: '{$signPackage["timestamp"]}',  
nonceStr: '{$signPackage["nonceStr"]}',  
signature: '{$signPackage["signature"]}', 
jsApiList: [  
// 所有要调用的 API 都要加到这个列表中  
'chooseImage','previewImage','uploadImage','downloadImage'  
]  
});  
wx.ready(function () {  
// 5.3 上传图片  
$('.uploadImage').on('click', function () {  
    wx.chooseImage({  
        success: function (res) {  
            var localIds = res.localIds;  
            syncUpload(localIds);  
        }  
    });  
});  
var syncUpload = function(localIds){  
    var localId = localIds.pop();  
    wx.uploadImage({  
    localId: localId,  
    isShowProgressTips: 1,  
    success: function (res) {  
        var serverId = res.serverId; // 返回图片的服务器端ID  
        var str = $('#img_str').val()+serverId+',';  
        $('.imglist').append("<img src='"+localId+"' style='width:50px;height:50px' />");  
        $('#img_str').val(str);  
        //其他对serverId做处理的代码  
        if(localIds.length > 0){  
        syncUpload(localIds);  
        }  
        if($('.imglist img').size() >= 9) {  
            $("#upload_button").hide();  
        }  
    },  
    fail: function (res) { alert(JSON.stringify(res)); }  
    });  
};  
});  
</script>  
  
<script>  
  
  $(".sb").click(function(){  
      var imglist = $(".imglist").html();  
       
      if(imglist == "" || imglist == null) {  
         alert("请添加图片");  
           return false;  
      } else {  
          if($(".imglist").find('img').size() >9) {  
              alert("图片只允许上传9张！");  
              return false;  
          }  
      var img_str = $('#img_str').val();  
      }  
  
      $.post("{:U('wxupload')}", {img_str:img_str},function(data){  
          alert('成功');
      });  
  });  
  
</script>  
</body>  
</html>